<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    
    <title>01_CSS简介</title>
    <!-- 
        第二种方式(内部样式表)：
                将样式编写到head中的style标签里
                    然后通过css的选择器来选中元素并设置格式
                    可以同时为多个标签设置样式，修改也只需要改一处
                缺点：只能对当前页面起作用
     -->

     <style>
        p{color: green; font-size: 30px; }
     </style>
    <!-- 
        第三种：外部样式表
            可以将css样式编写到一个外部的css文件中
                然后通过link标签来引入外部css文件
            优点：使样式可以在不同的页面之间复用（开发中最好用）
            将样式编写到外部CSS文件中，可以使用到浏览器的缓存机制
                从而加开网页的加载速度，提高用户的体验
     -->
     <link rel="stylesheet" href="./style.css">
</head>
<body>
    <!-- 
        CSS 层叠样式表：
                    网页实际是多层结构，通过CSS可以分别为网页的每一层来设计样式
                    而最终我们能看到的只是网页的最上层
                Css用来设置网页中元素的样式

        第一种方式（内联样式，行内样式）
                在标签内部通过style属性设置元素样式
                缺点：只能对一个标签生效，对于多个需要同样效果的标签，需要一个个修改
                注意：开发时绝对不要用
     -->

     <p style="color: red; font-size:30px;">少小离家老大回，乡音无改鬓毛衰</p>
     <p >少小离家老大回，乡音无改鬓毛衰</p>
     <p >少小离家老大回，乡音无改鬓毛衰</p>
    


</body>
</html>